<template>
  <div id="app">
    <!-- <Header></Header> -->
    <!-- Affix实现头部在下拉时始终悬挂在头部 -->
    <Affix>
      <!-- <span class="demo-affix">Fixed at the top</span> -->
      <Header></Header>
    </Affix>
    <router-view></router-view>
    <!-- 可以选择性的选择哪些页面不加载Footer -->
    <Footer v-if="excludeRoutes.indexOf($route.name) == -1"></Footer>
    <!-- <BackTop></BackTop> -->
    <BackTop :height="100" :bottom="200">
      <div class="top">返回顶端</div>
    </BackTop>
  </div>
</template>
<script>
import Header from "@/components/header/Header";
import Footer from "@/components/footer/Footer";
export default {
  data() {
    return {
      excludeRoutes: [
        "HomeIndex",
        "MyAddress",
        "AddAddress",
        "MyOrder",
        "MyShoppingCart"
      ]
    };
  },
  //  这里注册要挂载的组件
  components: {
    Header,
    Footer
  }
};
</script>>
<style>
#app {
  /* margin-top: 60px; */
  /* text-align: center; */
  /* background-color: red */
  min-width: 1200px;
}

.top {
  padding: 10px;
  background: rgba(0, 153, 229, 0.7);
  color: #fff;
  text-align: center;
  border-radius: 2px;
}
</style>
